// 实现这个项目的构建任务
const path = require('path');
const del = require('del');
const cwd = process.cwd();

const { series, parallel, src, dest } = require('gulp');
const loadPlugins = require('gulp-load-plugins');
const plugins = loadPlugins();

const watch = require('gulp-watch');
const browserSync = require('browser-sync');
const bs = browserSync.create();
const configData = require(path.join(cwd, 'mygulpcli.config.js'));


let config = {
    build: {
        src: 'src',
        dist: 'dist',
        temp: 'temp',
        public: 'public',
        paths: {
            scss: 'assets/styles/*.scss',
            scripts: 'assets/scripts/*.js',
            pages: '*.html',
            images: 'assets/images/**',
            fonts: 'assets/fonts/**'
        }
    }
};

config = Object.assign({}, config, configData);

// html
const htmls = () => {
    return src(config.build.paths.pages, {
        base: config.build.src,
        cwd: config.build.src
    })
        .pipe(
            plugins.swig({
                data: configData.data,
                defaults: { cache: false }
            })
        )
        .pipe(dest(config.build.temp))
        .pipe(bs.reload({stream:true}));
};

// js
const scripts = () => {
    return src(config.build.paths.scripts, {
        base: config.build.src,
        cwd: config.build.src
    })
        .pipe(
            plugins.babel({
                presets: ['@babel/env']
            })
        )
        .pipe(dest(config.build.temp))
        .pipe(bs.reload({stream:true}));
};

// scss
const styles = () => {
    return src(config.build.paths.scss, {
        base: config.build.src,
        cwd: config.build.src
    })
        .pipe(
            plugins.sass()
        )
        .pipe(dest(config.build.temp))
        .pipe(bs.reload({stream:true}));
};

// image
const images = () => {
    return src(config.build.paths.images, {
        base: config.build.src,
        cwd: config.build.src
    })
        .pipe(
            plugins.imagemin()
        )
        .pipe(dest(config.build.dist));
};

// font
const fonts = () => {
    return src(config.build.paths.fonts, {
        base: config.build.src,
        cwd: config.build.src
    })
        .pipe(
            plugins.imagemin()
        )
        .pipe(dest(config.build.dist));
};

// public
const public = () => {
    return src(config.build.public, {
        base: config.build.public
    })
        .pipe(dest(config.build.dist))
}
const clean = () => {
    return del([config.build.dist, config.build.temp]);
};

const development = () => {

    // 文件监听要写在前面
    watch(config.build.paths.pages, { cwd: config.build.src }, htmls);
    watch(config.build.paths.scripts, { cwd: config.build.src }, scripts);
    watch(config.build.paths.scss, { cwd: config.build.src }, styles);

    watch([config.build.paths.fonts, config.build.paths.images], { cwd: config.build.src }, bs.reload)

    bs.init({
        notify: false,
        server: {
            baseDir: [config.build.temp, config.build.src, config.build.public],
            routes: {
                '/node_modules': 'node_modules',
            }
        },
    });
}

const useref = () => {
    // html js css
    
    return src(path.join(config.build.temp, config.build.paths.pages), { base: config.build.temp })
        .pipe(plugins.useref({ searchPath: [config.build.temp, '.'] }))
        .pipe(plugins.if(/\.js$/, plugins.uglify()))
        .pipe(plugins.if(/\.css$/, plugins.cleanCss()))
        .pipe(plugins.if(/\.html$/, plugins.htmlmin(
        {
            collapseWhitespace: true,
            minifyCSS: true,
            minifyJS: true
            }
        )))
        .pipe(dest(config.build.dist))
};


const complie = parallel(htmls, scripts, styles);
const build = series(clean, parallel(series(complie, useref), images, fonts, public));
const dev = series(clean, complie, development);
module.exports = {
    dev,
    clean,
    build,
};